<script setup lang="ts">
import { ref } from 'vue'

const entryRegistrationList = ref([
  {
    id: '1952023186307710977',
    entryRegisterNo: 'ER0522508030001',
    status: '1',
    driverName: '许红林',
    driverIdCard: '530324198712200535',
    driverPhone: '15974628609',
    vehicleLicensePlate: '云AM1198',
    sourceSettingId: '1',
    storehouseName: '广州市粮食集团有限责任公司储备分公司海珠粮库',
    entryTime: '2025-08-03 23:05:56',
    frontNo: 'M25044-1-1-1',
    behindNo: 'PIW05220250803001',
    bak1: '2360000',
    imageCount: '0',
    listCount: '0',
    behindId: '1952023192762744834',
    turnLot: 'CLF0124GZ05ZC78',
  },
  {
    id: '1951095132320374785',
    entryRegisterNo: 'ER0522508010004',
    status: '1',
    driverName: '王忠',
    driverIdCard: '352202197011275710',
    driverPhone: '13706021361',
    vehicleLicensePlate: '万218',
    sourceSettingId: '1',
    storehouseName: '广州市粮食集团有限责任公司储备分公司海珠粮库',
    entryTime: '2025-08-01 09:38:00',
    frontNo: '011A171101-1-1-1',
    behindNo: 'PIW05220250801004',
    bak1: '1110000',
    bak5: '998000.000000',
    imageCount: '0',
    listCount: '1',
    behindId: '1951095158836764673',
    roughWeight: '998000.000',
    tare: '0.000',
    suttle: '998000.000',
    turnLot: 'GZPX22002',
  },
  {
    id: '1951089497226813441',
    entryRegisterNo: 'ER0522508010003',
    status: '1',
    driverName: '郭红林',
    driverIdCard: '530424198705100013',
    driverPhone: '19987710878',
    vehicleLicensePlate: '云AJ2119',
    sourceSettingId: '1',
    storehouseName: '广州市粮食集团有限责任公司储备分公司海珠粮库',
    entryTime: '2025-08-01 09:14:32',
    frontNo: '011A171101-1-1-1',
    behindNo: 'PIW05220250801003',
    bak1: '1110000',
    bak5: '1000.000000',
    imageCount: '0',
    listCount: '1',
    behindId: '1951089509625176066',
    roughWeight: '1000.000',
    tare: '0.000',
    suttle: '1000.000',
    turnLot: 'GZPX22002',
  },
])
const styles = ['success', 'danger', 'info', 'warnign', 'danger', 'danger', 'danger', 'danger']
</script>

<template>
  <div class="table-container">
    <vxe-table
      border
      :data="entryRegistrationList"
      show-overflow
      align="center"
      :row-config="{ height: 35 }"
      height="500px"
    >
      <vxe-column type="checkbox" width="50" fixed="left"></vxe-column>
      <vxe-column type="seq" title="序号" width="50" fixed="left" />
      <vxe-column title="入园单号" field="entryRegisterNo" width="180" fixed="left" />
      <vxe-column title="入园时间" field="entryTime" width="180" sortable fixed="left"></vxe-column>
      <vxe-column title="离园时间" field="outTime" width="150" sortable fixed="left"></vxe-column>
      <vxe-column title="状态" field="status" width="100">
        <template #default="{ row }">
          <el-tag type="success">
            {{ row.status }}
          </el-tag>
        </template>
      </vxe-column>
      <vxe-column title="关联单据" field="sourceSettingId" width="100">
        <template #default="{ row }">
          <el-tag type="success">
            {{ row.sourceSettingId }}
          </el-tag>
        </template>
      </vxe-column>
      <vxe-column title="图片" width="180" align="left" header-align="center">
        <template #default="{ row }">
          <span style="color: #999; font-weight: 400; margin: 0 5px"
            >({{ row.imageCount ?? 0 }}/11)</span
          >
          <span style="color: #999; font-weight: 400">({{ row.listCount ?? 0 }}/1)</span>
        </template>
      </vxe-column>
      <vxe-column title="司机姓名" field="driverName" width="100" />
      <vxe-column title="司机电话" field="driverPhone" width="150" />
      <vxe-column title="车牌号" field="vehicleLicensePlate" width="100" />
      <vxe-column title="车辆净重" field="bak5" width="100">
        <template #default="scope">
          <!-- 格式化保留整数 -->
          <span>{{ scope.row.bak5 ? parseInt(scope.row.bak5) : '-' }}</span>
        </template>
      </vxe-column>
      <vxe-column title="车辆毛重" field="roughWeight" width="100">
        <template #default="scope">
          <!-- 格式化保留整数 -->
          <span>{{ scope.row.roughWeight ? parseInt(scope.row.roughWeight) : '-' }}</span>
        </template>
      </vxe-column>
      <vxe-column title="车辆皮重" field="tare" width="100">
        <template #default="scope">
          <!-- 格式化保留整数 -->
          <span>{{ scope.row.tare ? parseInt(scope.row.tare) : '-' }}</span>
        </template>
      </vxe-column>
      <vxe-column title="粮食" field="bak1" width="100">
        <template #default="{ row }">
          <el-tag type="success">
            {{ row.bak1 }}
          </el-tag>
        </template>
      </vxe-column>
      <vxe-column title="批文" field="ctrunLot" min-width="170">
        <template #default="scope">
          <el-tag
            v-for="(item, index) in scope.row.turnLot.split(',')"
            :type="styles[index]"
            :key="index"
          >
            {{ item }}
          </el-tag>
        </template>
      </vxe-column>
      <vxe-column title="上游单据" field="frontNo" width="250">
        <template #default="scope">
          <el-tag
            v-for="(item, index) in scope.row.frontNo.split(',')"
            :type="styles[index]"
            :key="index"
          >
            {{ item }}
          </el-tag>
        </template>
      </vxe-column>
    </vxe-table>
  </div>
</template>

<style scoped lang="scss">
.table-container {
  margin: 20px;
}
</style>
